<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>后台系统 | 登  录</title>
	<!-- Tell the browser to be responsive to screen width -->
	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
	<!-- Bootstrap 3.3.5 -->
	<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<!-- Font Awesome -->
	<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
	<!-- Ionicons -->
	<link rel="stylesheet" href="https://cdn.bootcss.com/ionicons/2.0.1/css/ionicons.min.css">
	<!-- Theme style -->
	<link rel="stylesheet" href="../adminlte/dist/css/AdminLTE.min.css">
	<link rel="stylesheet" href="https://cdn.bootcss.com/layer/3.0.1/skin/default/layer.min.css">
	
	
	<!-- jQuery -->
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
	
	<!-- jquery.cookie -->
	<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
	<!-- Bootstrap 3.3.5 -->
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	
	<script src="https://cdn.bootcss.com/vue/2.4.1/vue.min.js"></script>
	<script src="https://cdn.bootcss.com/layer/3.0.1/layer.min.js"></script>
	<script src="../js/byking.js"></script>
	<script src="../js/MD5.js"></script>
	<script src="../js/base64.js"></script>
	<script src="../js/hostconfig.js"></script>
	
</head>
<body class="hold-transition login-page" style="background:url('../image/login.jpg')">
<div class="login-box"   id="login">
	<div class="login-logo">
		<h1><font color="#fff">后台系统</font></h1>
	</div>
  
	<!-- 登录界面 开始 -->
	
	<div class="login-box-body">
		<form action="" method="post">
			<!-- 账号 -->
			<div class="form-group has-feedback">
				<input type="text" class="form-control" placeholder="账号" v-model="data.username" :value="data.username">
				<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
			</div>
			<!-- 密码 -->
			<div class="form-group has-feedback">
				<input type="password" class="form-control" placeholder="密码"  v-model="data.password" :value="data.password">
				<span class="glyphicon glyphicon-lock form-control-feedback"></span>
			</div>
			
			<!-- 登录 -->
			<div class="row">
				<div class="col-xs-12">
					<button type="button" class="btn btn-primary btn-block btn-flat" @click="login()">登    录</button>
				</div>
			</div>
		</form>
	</div>
	<!-- 登录界面 结束 -->
</div>
</body>
<script type="text/javascript">
var data = {
	username: null,
    password: null
};

var login = new Vue({
    el:"#login",
    data: data,
    methods:{
    	login:function(){
    		if(this.username == null || this.username == ""){
    			layer.msg("登录账号必须填写!");
    			return;
    		}
    		if(this.password == null || this.password == ""){
    			layer.msg("登录密码必须填写!");
    			return;
    		}
    		var url = $hostconfig.sysAuthHost + "/sso/login";
    		var param = {
    			username: this.username,
    			password: hex_md5(this.password)
    		};
    		$byking.postJSON(url, param , function(data){
    			var data = data.data;
    			$byking.setAccountInfo(data);
    			window.location.href = "index.html";
    		},function(data){
    			layer.msg(data.responseJSON.message,{icon:5});
    		});
    	}
    }
});
</script>
</html>
